import { api } from '@/global';
import { UngroupOutlined } from '@ant-design/icons';
import { Tag, Tree } from 'antd';
import { useEffect, useState } from 'react';
import { request } from 'umi';
const TreeNode = Tree.TreeNode;

type dataType = {
  id: number;
  deptName: string;
  number: number;
};

export default (props: any) => {
  const [data, SetData] = useState<dataType[]>();
  useEffect(() => {
    const initData = async () => {
      const result = await request(api.getDeptApproveFile);
      SetData(result.data);
    };
    initData();
  }, []);
  return (
    <div>
      <Tree
        onSelect={(selectedKeys: any) => {
          props?.getSelectNode(selectedKeys[0]);
        }}
      >
        {data &&
          data.map((i) => {
            return (
              <TreeNode
                key={i.id}
                title={() => {
                  return (
                    <div>
                      <span style={{ fontSize: 15 }}>{i.deptName}</span>
                      {i.number != null && (
                        <Tag color={'#3498db'} style={{ marginLeft: 15 }}>
                          {i.number}
                        </Tag>
                      )}
                    </div>
                  );
                }}
              />
            );
          })}
      </Tree>
    </div>
  );
};
